<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // ES5 
        // var obj = {
        //     name: "小甜甜"
        // }

        // console.log(obj.name)
        // obj.name = "小贤贤"
        // console.log(obj.name)

        var obj = {}
        var str = ""
        // 对对象的 属性 设置或者获取的时候进行监听。
        // define 定义  property 属性
        Object.defineProperty(obj, 'name', {
            // value: "小甜甜",
            // writable: true,
            // // 可枚举 可遍历
            // enumerable: false,

            // 当属性获取的时候 该get函数会自动调用
            get() {
              console.log("我监听到了你获取了该值")
              return "北游欢迎您:" + str
            },
            set(val) {
                str = "@:" + val
            }
        })

        console.log(obj.name)
        obj.name = "小甜甜"
        console.log(obj.name)

        // console.log(obj.name)
        // obj.name = "小贤贤"
        // console.log(obj.name)
        // for(let key in obj) {
        //     console.log(obj[key])
        // }

        // 必须使用defineProperty进行定义才能监听
        obj.age = 20;

    </script>
</body>
</html>